<template>
      <div id="navbar">
            <div class="content">
                  <div class="left">
                        一号家政后台管理
                  </div>
                  <div class="right" v-if="IsLogin">
                        欢迎您,管理员!
                        <el-button class="logout" type="danger" @click="editPass">修改密码</el-button>
                        <el-button class="logout" @click="logout">退出</el-button>
                        
                  </div>
                  <img :src="qrcode" id="qrcode"  alt="" width="50" height="50" >
            </div>

            <!-- 修改密码 -->
            <edit-pass :DialogData="DialogData"></edit-pass>
      </div>
</template>

<script>
import EditPass from "./EditPass"
import { log } from 'util';
      export default {
            data() {
                  return {
                        DialogData: {
                              show: false
                        },
                        qrcode: "",
                  }
            },
            components: {
                  EditPass,
            },
            computed: {
                  IsLogin() {
                        return localStorage.miniToken ? true : false;
                  },
                  token() {
                        return localStorage.miniToken;
                  },
            },
            mounted() {
                  // this.showCode()
                  
            },
            methods: {
                  logout() {
                        localStorage.removeItem("miniToken")
                        this.$router.push("/login")
                        this.$message.success("退出管理员账户")
                  },
                  editPass() {
                        this.DialogData = {
                              show: true
                        }
                  },
                  // 生成二维码
                  async CreateQrcode(  ) {
                        if (this.token) {
                              let res = await this.$axios.post("/admin/user/agentqrcode", { token: this.token })  
                        }
                  },
                  // 查看二维码
                  async showCode() {
                        let ret = await this.$axios.post("/admin/user/lookqrcode", { token: this.token })
                        //console.log(ret); 
                        this.qrcode = `https://${ret.data.data.erweima}`   
                        //console.log(this.qrcode);
                           
                  },
            },
      }
</script>

<style lang="scss" scoped>
#navbar {
      width: 100%;
      background-color: #10142f;
      #qrcode {
            margin-top: 5px;
      }
      .content {
            width: 1200px;
            background-color: #10142f;
            display: flex;
            justify-content: space-between;
            box-sizing: border-box;
            margin: 0 auto;
            height: 60px;
            overflow: hidden;
            .left {
                  color: #fff;
                  font-size: 30px;
                  line-height: 60px;
                  margin-left: 60px;
                  width: 300px;
            }
            .right {
                  color: #fff;
                  font-size: 18px;
                  line-height: 60px;
                  margin-right: 60px;
                  width: 700px;
                  text-align: right;
                  .logout {
                        margin-left: 20px;
                  }
            }
      }
}
</style>